<form id="frmLogin" action="<?php echo WEB_PATH;?>/front/" method="post">
<input type="hidden" name="do" value="login" />
<div class='login-container'>
            <div class='container'>
              <div class='row'>
                <div class='col-sm-4 col-sm-offset-4'>
                  <h1 class='text-center title'>Magazine Publishing System</h1>
                  <form action='index.html' class='validate-form' method='get'>
                    <div class='form-group'>  
                      <div class='controls with-icon-over-input'>
                        <input value="" placeholder="Username" class="form-control" data-rule-minlength="1" data-rule-required="true" id="username" name="username" type="text" />
                        <i class='icon-user text-muted'></i>
                      </div>
                    </div>
                    <div class='form-group'>
                      <div class='controls with-icon-over-input'>
                        <input value="" placeholder="Password" class="form-control" data-rule-minlength="1"  data-rule-required="true" id="password" name="password" type="password" />
                        <i class='icon-lock text-muted'></i>
                      </div>
                    </div>
                    <button id="btnLogin" class='btn btn-block'>Login</button>
                  </form>
                </div>
              </div>
            </div>
          </div>
</form>
<script language="javascript">
	$(document).ready(function(){
		$('#btnLogin').click(function(){
			if($('#username').val() == ''){
				alert("Please enter username");
				$('#username').focus();
				return false;
			}
			if($('#password').val() == ''){
				alert("Please enter password");
				$('#password').focus();
				return false;
			}else{
				$('#frmLogin').submit();
			}
		});
	});
</script>